<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
    <div id="app">
        <form action="http://localhost:8083/m1/doAdd" method="POST" role="form" enctype="multipart/form-data">
            <legend>提交名单</legend>
            <!-- 修改信息时需要传递id用的 -->
            <div class="form-group" style="display: none;">
                <label for="">参数id，这里是不显示在页面上的</label>
                <input type="text" class="form-control" id="hiddenId" name="id" value="{{if data}}{{data[0].id}}{{/if}}" placeholder="id">
            </div>

            <div class="form-group">
                <label for="">名字</label>
                <input type="text" class="form-control" id="name" name="name" value="{{if data}}{{data[0].name}}{{/if}}" placeholder="请输入姓名">
            </div>
            <div class="form-group">
                <label for="">年龄</label>
                <input type="text" class="form-control" id="age" name="age" value="{{if data}}{{data[0].age}}{{/if}}" placeholder="请输入年龄">
            </div>
            <div class="form-group">
                <label for="">爱好</label>
                <input type="text" class="form-control" id="like" name="like" value="{{if data}}{{data[0].like}}{{/if}}" placeholder="请输入爱好">
            </div>
            
            <div class="form-group">
                <label>是否点赞</label>
                {{if data}}
                    {{if data[0].state}}
                        <input type="checkbox" name="state" checked>
                    {{else}}
                        <input type="checkbox" name="state">
                    {{/if}}
                {{else}}
                    <input type="checkbox" name="state">
                {{/if}}
            </div>
            <div class="form-group">
                <label>是否交好友</label>
                {{if data}}
                    {{if data[0].friend}}
                        <input type="checkbox" name="friend" checked>
                    {{else}}
                        <input type="checkbox" name="friend">
                    {{/if}}
                {{else}}
                    <input type="checkbox" name="friend">
                {{/if}}
            </div>
                
            <div class="form-group">
                <label for="">头像</label>
                <!-- 注意这里的name要和后面的一致 -->
                <input type="file" name="file">
            </div>
            <button type="submit" class="btn btn-primary">提交</button>
        </form>
    </div>
</body>
</html>